body{
    margin: 0;
    padding: 0;
    width: 1500px;
    height: 800px;
    overflow: auto;
}

.main{
    width: 96%;
    margin: 9px auto;
    height: 800px;
}

.movie-detail {
    float: left;
    width: 460px;
    height: 600px;
    border: 1px solid #cdcdcd;
    background: #efefefef;
    box-shadow: 3px 3px 3px #cdcdcd;
    margin: 9px;
}

.movie-detail-top{
    display: flex;
    justify-content: space-between;
}

.movie-detail-top img {
    width: 199px;
    height: 230px;
    background: #cce;
    float: left;
    margin: 10px;
}

.movie-button{
    width: 85px;
    height: 38px;
    font-size: 12px;
    display: block;
    border-radius: 15px;
    background-color: #f12;
    color: #fff;
    padding: 9px;
    float: right;
    margin-right: 24px;
    box-shadow: 3px 3px 3px #cdcdcd;
}


.movie-button:hover{
    background-color: #ff112266;
}

.movie-introduction{
    text-indent: 2em;
    font-size: 13px;
    line-height: 30px;
    display: -webkit-box;
    padding: 0 12px;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 6;
    overflow: hidden
}

.movie-detail-top table {
    margin: 2px;
    width: 240px;
    height: 236px;
    text-align: start;
    padding-left: 9px;
    font-size: 13px;
    font-family: 楷体;
}


header{
    overflow:hidden;
    width:100%;
    height:100px;
    background-color:#fff;
    border-bottom:1px solid #e2e2e2;
}
header a.fa{
    list-style:none;
    float:left;
    width:15%;
    font-size:40px;
    line-height:100px;
    text-align:left;
    text-indent: 36px;
    color:#4ad3fe;
}
header span{
    float:left;
    width:70%;
    text-align:center;
    line-height:100px;
    font-size:30px;
}

.fa-angle-left:before {
    content: "\f104";
}
.fa{
    display: inline-block;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
